
<script setup>
import { useRoute } from 'vue-router';
import { ref } from 'vue';

const route = useRoute();
const username = ref(route.params.username); // 获取路由参数里的用户名并设置为响应式数据

watch(
    () => route.params.username, // 监听路由参数里用户名的变化
    (newValue) => {
      username.value = newValue; // 当用户名变化时，更新组件内的响应式数据，触发界面更新
    }
);
</script>
<template>
  <div>
    <!-- 根据组件具体业务展示相关内容，这里假设展示一个欢迎信息，使用了路由参数里的用户名 -->
    <p>欢迎 {{ username }}</p>
  </div>
</template>

<style scoped>

</style>